<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <ul>
        <li>知否知否,应是绿肥红瘦1</li>
        <li>知否知否,应是绿肥红瘦2</li>
        <li>知否知否,应是绿肥红瘦3</li>
        <li>知否知否,应是绿肥红瘦4</li>
        <li>知否知否,应是绿肥红瘦5</li>
    </ul>
    <ol id="ol">
        <li>生僻字</li>
        <li>生僻字</li>
        <li>生僻字</li>
    </ol>
    <script>
        //1.返回的是 获取过来元素对象的集合 以伪数组的形式存储的
        var lis = document.getElementsByTagName('li');
        console.log(lis);
        console.log(lis[0]); // <li>知否知否,应是绿肥红瘦1</li>
        //2.想要依次打印里面的元素对象可以采取遍历的方式
        for (var i = 0; i < lis.length; i++) {
            console.log(lis[i]);
        }

        //其实使用for in 应该也可以 因为获取的是元素对象 而for in 就是为了遍历对象的 所以我自己认为应该可以用
        //而且与上面遍历相同
        /* for (k in lis) {
            console.log(lis[k]);
        } */

        //3.如果页面中只有一个li 返回的还是伪数组的形式
        //4.如果页面中没有这个元素 返回的是空的伪数组
        //5.element(标签的父元素).getElementsByTagName('标签名');  [这是需要选择ol中的li的情况]
        //可以使用这种方法
        var ol = document.getElementsByTagName('ol'); //[ol]  (因为只有一个,所以伪数组中只放一个,但是不确定所以需要ol[0]来指明)
        console.log(ol[0].getElementsByTagName('li')); //但是不常用 一般情况都是将 ol赋予id(因为id是惟一的)

        //一般情况都是将 ol赋予id(因为id是惟一的)
        var ol = document.getElementById('ol');
        console.log(ol.getElementsByTagName('li'));
    </script>
</body>

</html>